<template>
  <div class="login-view" v-if="isComponentLoaded">
    <component :is="LoginForm" ref="moudleRef" />
  </div>
</template>

<script setup lang="ts">
defineOptions({
  name: "LoginView",
  components: {}
});


import { provide, ref, onMounted, type DefineComponent, watch } from 'vue';
import type { ModuleInterface, SendCmd } from "@/common/index";
import { SEND_LOGIN_CMD_KEY, GET_LOGIN_DATA_KEY } from "@/common/index";

import { handleCommand } from '@/utils/commandHandler';
import type { AxiosRequestConfig } from 'axios';
import type { Response } from '@/mctp-api';
import router from "@/router";
import { setToken } from "@/utils/authLib";
import { useRoute } from "vue-router";
const route = useRoute();
import { useAuthStore } from "@/store/modules/auth";
const authStore = useAuthStore();

import { LoadModules } from "@/utils/loadModules";

// 2. 响应式存储组件（核心）
const LoginForm = ref<DefineComponent | null>(null);
let createLoginModule: ((sendCmd: SendCmd<any, any>, initialData: any) => ModuleInterface<any>) | null = null;
const isComponentLoaded = ref(false); // 标记组件是否加载完成，控制模板渲染
interface LoginFormInstance {
  dataEvent: (value: any) => void; // 匹配组件的 dataEvent 方法定义
}
const moudleRef = ref<(DefineComponent & LoginFormInstance) | null>(null);
const index = ref(0);
const redirect = ref("");

// const SEND_LOGIN_CMD_KEY = "send-login-cmd"; // 协商好的字符串Key
// const GET_LOGIN_DATA_KEY = "get-login-data"; // 配套的“获取数据”Key

const sendLoginCmd = ref<(cmd: string, cmdParams?: any) => any>();
const getLoginData = ref<any>();

provide(SEND_LOGIN_CMD_KEY, sendLoginCmd);
provide(GET_LOGIN_DATA_KEY, getLoginData);

// 登录模块加载函数（支持插件命名机制）
const importMoudule = async () => {
  const moduleName: string = '登录';
  try {
    const loadModulesInstance = new LoadModules();
    const module = await loadModulesInstance.loadModule(moduleName);
    console.log("模块加载结果完整结构：", module);
    
    // 尝试多种方式获取createLoginModule
    createLoginModule = module.createLoginModule || module.default?.createLoginModule || module.default;
    
    // 尝试多种方式获取LoginForm，适配不同的模块导出结构
    LoginForm.value = module.LoginForm || module.default?.LoginForm;
    
    console.log(`登录模块[${moduleName}]加载成功`, { 
      createLoginModule: !!createLoginModule, 
      LoginForm: !!LoginForm.value 
    });

  } catch (e) {
    console.error(`登录模块[${moduleName}]加载失败`, e);
  }
};

const loadModule = async () => {
  if (!createLoginModule) {
    console.error("createLoginModule 未加载完成");
    return;
  }
  // 1. EventData 初始值：空对象（业务数据由后端返回，初始无需填充）
  const initialCalibData = {};

  // 2. 平台命令处理：完全转发插件传递的所有参数，对齐 createPost 逻辑
  const handleModuleCmd: SendCmd<{
    moduleId: string;
    fixedParams?: any;
    data?: Record<string, any>;
    params?: any;
    config?: AxiosRequestConfig;
  }, Response<any>> = async (moduleName, cmd, cmdParams) => {
    if (moduleName !== "LoginForm") return { code: 400, msg: "模块不匹配", data: null };

    console.log("来自插件的请求--LoginForm");

    console.log("平台接收登录指令：", cmd, "相关配置内容为", cmdParams);

    // const { commandName, command } = cmdParams?.fixedParams || {};
    // const unifiedCommand = commandName || command || "";

    let url = `/api/Auth/SendCommand`;

    // 直接调用平台的 handlePluginCommand，传递所有参数（复刻 createPost 逻辑）
    const resonseResult = await handleCommand(
      url, // url
      cmdParams?.fixedParams, // 固定参数（对齐 createPost 的 fixedParams）
      cmdParams?.data, // 业务数据（对齐 createPost 的 data）
      cmdParams?.params, // URL 参数（对齐 createPost 的 params）
      cmdParams?.config // Axios 配置（对齐 createPost 的 config）
    );
    console.log("登录指令执行结果", resonseResult);
    if (resonseResult?.data === null) {
      return { code: 400, msg: "登录失败", data: null };
    }
    router.push("/");
    resonseResult.data?.token && setToken(resonseResult.data?.token);
    return { code: 200, msg: "登录成功", data: null };
  };

  // 3. 创建插件实例：完全对齐原有调用方式
  const loginModule: ModuleInterface<typeof initialCalibData> = createLoginModule(
    handleModuleCmd,
    initialCalibData
  );

  // 关键：更新响应式引用，而不是重新提供
  sendLoginCmd.value = (cmd: string, cmdParams?: any) => {
    return loginModule.sendCommand(cmd, cmdParams);
  };
  getLoginData.value = () => loginModule.eventData;

  // 5. 手动初始化插件
  await loginModule.startup();

  isComponentLoaded.value = true;

  watch(
    route,
    (route) => {
      const query = route.query;
      if (query.redirect && query.redirect !== "/login") {
        redirect.value = String(query.redirect);
      }
    },
    { immediate: true }
  );

}

onMounted(async () => {
  // 可以从路由参数、配置或props中获取插件名称
  console.log("准备加载登录页面");

  document.title = authStore.systemName;

  await importMoudule();
  console.log("createLoginModule", createLoginModule, "LoginForm", LoginForm);
  await loadModule();
  (moudleRef.value as any)?.dataEvent(index.value);
})

</script>

<style lang="scss" scoped></style>
